<html lang="zh-CN">
<head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8">
    <style>
        #subscriberManage.el-checkbox__input>.el-checkbox__inner {
            display:none;
        }
        #subscriberManage.is-leaf + .el-checkbox .el-checkbox__inner {
            display:inline-block;
        }
        .tree_class{
            height: 970px;
            /*border-right: 1.5px solid #57a3f3;*/
        }
        @media (max-width: 1366px) {
            #subscriberManage .table-wrap {
                height: 500px !important;;
                overflow: auto;
            }
            .tree_class{
                height: 6860px;
                /*border-right: 1px solid #57a3f3;*/
            }
        }
        .table-head{
            background-color: #EEF4FF;
            color: #333333;
            font-weight: normal;
            font-size: 14px;
            font-family: SourceHanSansCN;
            border: none;
            padding: 12px 15px;
            text-align:left !important;
        }
        .table-croll{
            display:table;
            padding:0px;
            width:100%;
        }
        .croll {
            display:table-row;
            list-style: none;
            height: 30px;
            width:100%;
            border-top: 0px;
            font-size: 13px;
            color: #333333;
            cursor:move;
            margin-block-start: 0em;
            margin-block-end: 0em;
            margin-inline-start: 0px;
            margin-inline-end: 0px;
            padding-inline-start: 0px;
            line-height:25px;
            text-align:left ! important;
        }
        .croll li {
            display:table-cell ;
            float: left;
            width:15%;
            text-indent: 2em;
            list-style-type:none;
            height:25px;
            padding-left:5px;
            overflow:hidden;
            white-space:nowrap;
            vertical-align: middle;
            text-overflow:ellipsis
        }
        .croll:nth-of-type(even){ background:#f0f3f6;}
    </style>
</head>
<body>
<div id="subscriberManage" class="center_div" style="display:none;">
    <div style="float:left;width:19%;background: white;position: absolute;" class="tree_class">
        <div style="height: 90%;overflow:auto;margin-top: 2%">
            <el-tree check-strictly
                     :load="loadChildren"
                     highlight-current
                     lazy
                     node-key="id"
                     :props="defaultProps"
                     :filter-node-method="filterNode"
                     ref="tree"
                     @node-click="loadDataaa">
                <span class="custom-tree-node" style="font-size: 14px" slot-scope="{ node, data }">
                    <span v-if="data.type===0"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                    <span v-if="data.type===1"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                </span>
            </el-tree>
        </div>
    </div>
    <div style="float:right;width: 80%">
        <div class="searchForm" style="margin-top: 1%;margin-left: 1%">
            <template>
                终端名称：
                <el-input v-model="subName" size="mini" style="width: 10%"></el-input>
                登陆账号：
                <el-input v-model="subNumber" size="mini" style="width: 10%"></el-input>
                分机号码：
                <el-input v-model="extNumber" size="mini" style="width: 10%"></el-input>
                所属集团:
                <el-select v-model="fleetName" :placeholder="'请选择'" size="mini" filterable clearable>
                    <el-option :value="fleetName" style="height: auto">
                        <el-tree
                                :load="loadChildren"
                                highlight-current
                                lazy
                                node-key="id"
                                :props="defaultProps"
                                :filter-node-method="filterNode"
                                ref="tree"
                                @node-click="loadData">
                        <span class="custom-tree-node" style="font-size: 14px" slot-scope="{ node, data }">
                            <span v-if="data.type===0"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                            <span v-if="data.type===1"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                        </span>
                        </el-tree>
                    </el-option>
                </el-select>
            </template>
            <el-button type="primary"  size="mini" @click="query(1)">查询</el-button>
            <el-button type="primary" size="mini" @click="add">添加</el-button>
            <el-button type="primary" size="mini" @click="sort">调整排序</el-button>
        </div>
        <div class="table-wrap" style="margin-left: 1%">
            <el-table
                    :data="tableData"
                    style="width:100%;text-align: center"
                    header-cell-style="font-size:15px;text-align:center;color:#515A6E;padding:10px 0px 10px 0px !important;background:#F5F5F6;border:1px solid #EBEBEB"
                    cell-style="font-size:13px;text-align:center;color:#606266;padding:5px 0px 5px 0px !important;border:1px solid #EBEBEB"
                    @selection-change="handleSelectionChange">
                <el-table-column v-for="title in tableTitle" :prop="title.prop" :label="title.label">
                </el-table-column>
                <template v-if="buttons && buttons.length!==0">
                    <el-table-column
                            class="align-right"
                            width="300px"
                            label="操作">
                        <template slot-scope="scope">
                            <el-button v-for="button in buttons"
                                       @click="operate(scope.row,button.href)" :type="button.type"
                                       class="el-button el-button--text el-button--medium">{{button.label}}
                            </el-button>
                        </template>
                    </el-table-column>
                </template>
            </el-table>
            <el-pagination
                    layout="prev, pager, next"
                    @current-change="changePageNum"
                    :current-page="pageNum"
                    :page-size="pageSize"
                    :total="total">
            </el-pagination>
        </div>
    </div>
    <el-dialog :title="title" :visible.sync="showSort" width="40%" append-to-body  @close="updateIndex">
        <div style="height: 300px">
            <div class="table-head table-croll">
                <ul class="croll" style="cursor:Default">
                    <li>终端名称</li>
                    <li>终端号码</li>
                    <li>分机号码</li>
                    <li>创建时间</li>
                    <li>所属集团</li>
                    <li>操作</li>
                </ul>
            </div>
            <div id="sub_items" class="table-croll">
                <ul  v-for="(item,index) in subData" class="croll" :key="item.subscriber_id">
                    <li>
                        {{item.NAME}}
                    </li>
                    <li>
                        {{item.NUMBER}}
                    </li>
                    <li>
                        {{item.EXTNUMBER}}
                    </li>
                    <li>
                        {{item.CREATEDATETIME}}
                    </li>
                    <li>
                        {{item.fleetName}}
                    </li>
                    <li>
                        <span><img src="images/newIcon/sortOperate.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle"></span>
                        <span><img src="images/newIcon/sortUp.png" style="height: 25px;width: 25px;margin-right: 10px;vertical-align: middle;cursor: pointer" @click="sortUp(index)"></span>
                    </li>
                </ul>
            </div>
        </div>
    </el-dialog>
    <el-dialog :title="title" :visible.sync="showBox" width="30%" append-to-body>
            <el-form ref="form" :model="form" label-width="80px" size="mini">
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="归属集团">
                            <el-select v-model="form.fleetName" :placeholder="'请选择'" filterable :disabled="showAdd==true?false:true">
                                <el-option :value="form.fleetName" style="height: auto">
                                    <el-tree
                                            :load="loadChildren"
                                            highlight-current
                                            lazy
                                            node-key="id"
                                            :props="defaultProps"
                                            :filter-node-method="filterNode"
                                            ref="tree"
                                            @node-click="loadDataa">
                                        <span class="custom-tree-node" style="font-size: 14px" slot-scope="{ node, data }">
                                            <span v-if="data.type===0"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                                            <span v-if="data.type===1"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                                        </span>
                                    </el-tree>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="终端类型">
                            <el-select v-model="form.subType" placeholder="请选择" :disabled="showAdd==true?false:true">
                                <el-option
                                        v-for="item in subTypeOptions"
                                        :key="item.ID"
                                        :label="item.name"
                                        :value="item.ID">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="终端名称">
                            <el-input v-model="form.name"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="终端号码">
                            <el-input v-model="form.number" type="number" :min="0"
                                      onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="终端密码">
                            <el-input v-model="form.password" type="password"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="IP分机号码">
                            <el-select v-model="form.extNumber" placeholder="请选择">
                                <el-option
                                        v-for="item in extNumberOptions"
                                        :key="item.Sipnumber"
                                        :label="item.Sipnumber"
                                        :value="item.Sipnumber">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-form-item>
                        <el-button type="primary" @click="addSubscriber" v-show="showAdd">添加</el-button>
                        <el-button type="primary" @click="updateSubscriber" v-show="!showAdd">修改</el-button>
                        <el-button type="primary" @click="closeBox">取消</el-button>
                    </el-form-item>
                </el-row>

            </el-form>
        </el-dialog>
    <!----------------------管理设备负责人------------------>
    <el-dialog title="设备负责人管理" :visible.sync="guarderManage.seen"   append-to-body>
        <div style="height: 400px" >

            <div style="float:left;width:60%;height:90%">
                <div>
                    <div class="split-line">请选择负责人</div>
                </div>
                <div style="height:99%;width:99%;margin-top:1%;background:white;overflow:auto">
                    <el-tree check-strictly
                             :load="loadGuarderChildren"
                             show-checkbox
                             highlight-current
                             lazy
                             node-key="id"
                             :props="guarderManage.defaultProps"
                             :filter-node-method="filterGuarderNode"
                             ref="tree"
                             @check-change="handleGuarderCheckChange">
                        <span class="custom-tree-node" style="font-size: 14px" slot-scope="{ node, data }">
                            <span v-if="data.type===0"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                            <span v-if="data.type===1"><img src="images/mapicon/tree_fleet.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                            <span v-if="data.type===2"><img src="images/mapicon/tree_sub.png" style="height: 15px;width: 15px;margin-right: 10px;vertical-align: middle">{{ node.label }}</span>
                        </span>
                    </el-tree>
                </div>
            </div>

            <div style="float:right;width:40%;height:90%;background: ghostwhite;overflow: auto">
                <div>
                    <div class="split-line">已选择负责人</div>
                </div>
                <el-row v-for="item in guarderManage.chooseData" :key="item.id" style="padding: 3px">
                    <el-col :span="16" style="padding-top: 5px;font-size: 13px">
                                <span style="text-overflow:ellipsis">
                                   {{item.name}}
                                </span>
                    </el-col>
                    <el-col :span="5">
                        <el-button @click="deleteGuarderMember(item.id)"
                                   class="el-button el-button--text el-button--medium">删除
                        </el-button>
                    </el-col>
                </el-row>
            </div>

        </div>
        <div slot="footer" class="dialog-footer">
            <el-button @click="guarderManage.seen = false" size="mini">取 消</el-button>
            <el-button type="primary" @click="guarderModify" size="mini">确 定</el-button>
        </div>
    </el-dialog>
</div>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Sortable/1.8.3/Sortable.min.js"></script>
<script>
    VueComponent.createSubscriberManage = function () {
        if (window.subscriberManageVue) {
            window.subscriberManageVue.refreshNodeBy();
            return;
        }
        window.subscriberManageVue = new Vue({
            el: "#subscriberManage",
            data: {
                checkGroup: '',
                defaultProps: {
                    label: 'name',
                    isLeaf: 'isLeaf'
                },
                subName:'',
                subNumber:'',
                extNumber:'',
                fleetName: '',
                searchData: {},
                tableTitle: [
                    {label: '终端名称', prop: 'NAME'},
                    {label: '终端号码', prop: 'NUMBER'},
                    {label: '分机号码', prop: 'EXTNUMBER'},
                    {label: '创建时间', prop: 'CREATEDATETIME'},
                    {label: '所属集团', prop: 'fleetName'},
                ],
                tableData: [],
                total: 0,
                pageNum: 1,
                pageSize: 10,
                buttons: [{label: "编辑", href: "update"}, {label: "删除", href: "delete"}, {label: "设备负责人", href: "guarder"}],
                multipleSelection: [],
                showBox: false,
                showSort: false,
                showAdd: true,
                title: '',
                form: {
                    subId: '',
                    fleetName: '',
                    fleetId: '',
                    subType: '',
                    mobileType: '',
                    extNumber: '',
                    name: '',
                    number: '',
                    password: '',
                    isNeedLoc: 1,
                    reportMode: 1,
                    reportType: 2,
                    circle: ''
                },
                subTypeOptions: [],
                mobileTypeOptions: [],
                extNumberOptions: [],
                checkedCap: [],
                Capabilities: [{label: '对讲', value: 0}, {label: '定位', value: 1}, {label: '视频', value: 2}, {
                    label: '短消息',
                    value: 3
                }, {label: 'IP语音', value: 4}, {label: 'IP视频', value: 5}],
                checkedPri: [],
                Privilege: [{label: '退出App', value: 0}, {label: '监听群组', value: 1}, {
                    label: '视频',
                    value: 2
                }, {label: '定位', value: 3}],
                isNeedLocOptions: [{label: '关', value: 0}, {label: '开', value: 1}],
                reportModeOptions: [{label: '签到上报', value: 0}, {label: '开机上报', value: 1}],
                reportTypeOptions: [{label: '设备模式(gps)', value: 0}, {
                    label: '高精度模式（GPS+网络+Wifi）',
                    value: 1
                }, {label: '低功耗模式（网络+Wifi）', value: 1}],
                checkGroup: '',
                checkFleet: '',
                checkMonitor: '',
                oldPassword: '',
                guarderManage: {
                    seen: false,
                    defaultProps: {
                        label: 'name',
                        isLeaf: 'isLeaf'
                    },
                    chooseData: [],
                    subId:'',
                },
                subData:[],
            },
            mounted: function () {
                this.query(1);
                this.getExtNumber();
                this.getMobileType();
            },
            methods: {
                updateIndex:function () {
                    console.log(this.subData);
                    var that=this;
                    axios.post('/scs/subscriberManage/updateSubscriberIndex', {subData:that.subData})
                        .then(function (res) {
                            var res = res.data;
                            if (res.success) {
                                that.query(1);
                            } else {
                                that.$message(res.msg);
                            }
                        })
                        .catch(function (err) {
                            console.log(err);
                        });
                },
                sortUp:function (index) {
                    let temp = this.subData[index];
                    for(var i = index ; i>0 ; i--){
                        this.$set(this.subData,i,this.subData[i-1]);
                    }
                    this.$set(this.subData,0,temp);
                },
                sort:function () {
                    var data = {
                        fleetId: window.fleetId,
                        pageNum:  1,
                        pageSize: 100000
                    };
                    axios.post('/scs/subscriberManage/getFleetSub', data)
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                for (var i = 0; i < data.obj.list.length; i++) {
                                    data.obj.list[i].CREATEDATETIME = timeFormat(data.obj.list[i].CREATEDATETIME);
                                }
                                if (res.data.success) {
                                    this.subData = data.obj.list;
                                } else {
                                    this.$message('查询失败');
                                }
                            } else {
                                this.$message('查询失败');
                            }
                        }.bind(this)).catch(function () {
                    }.bind(this));
                    this.title='调整排序';
                    this.showSort=true;
                    var that = this;
                    setTimeout(function () {
                        var el = document.getElementById('sub_items');
                        that.sortable = Sortable.create(el,{onEnd: function (evt) {
                                let itemEl = evt.item;
                                let oldIndex = evt.oldIndex;
                                let newIndex = evt.newIndex;
                                let temp = that.subData[oldIndex];
                                if( oldIndex < newIndex ){
                                    for(var i = oldIndex ; i < newIndex ; i++){
                                        that.subData[i] = that.subData[i+1];
                                    }
                                }else if( oldIndex > newIndex ){
                                    for(var i = oldIndex ; i > newIndex ; i--){
                                        that.subData[i] = that.subData[i-1];
                                    }
                                }
                                that.subData[newIndex] = temp;
                            },
                        });
                    },100);
                    setTimeout(function () {
                        $('.croll li').css('width','15%');
                        $('.croll li:nth-child(4)').css('width','25%');
                    },100);
                },
                loadDataaa:function (node) {
                    var data = {
                        fleetId: node.id,
                        pageNum:  1,
                        pageSize: this.pageSize
                    };
                    this.searchData.fleetId=node.id;
                    axios.post('/scs/subscriberManage/getFleetSub', data)
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                for (var i = 0; i < data.obj.list.length; i++) {
                                    data.obj.list[i].CREATEDATETIME = timeFormat(data.obj.list[i].CREATEDATETIME);
                                }
                                if (res.data.success) {
                                    this.tableData = data.obj.list;
                                    this.total = data.obj.total;
                                } else {
                                    this.$message('查询失败');
                                }
                            } else {
                                this.$message('查询失败');
                            }
                        }.bind(this)).catch(function () {

                    }.bind(this));
                },
                refreshNodeBy:function(){
                    var node = this.$refs.tree.getNode(window.fleetId);
                    node.loaded = false;
                    node.expand();
                },
                checkNumber: function () {
                    var number = this.form.number;
                    number = number.replace(/[^\d]/g, '');
                    if ((number.indexOf('.') < 0 && number != '') || (number.indexOf('e')) && number != '') {
                        number = parseInt(number);
                    }
                    this.$nextTick(function () {
                        this.form.number = number
                    })
                },
                handleCheckedCapChange: function (value) {
                    var checkedCount = value.length;
                },
                checkMange: function () {
                    if (this.checkAllGroup) {
                        this.checkSomeGroup = false
                    }
                    if (this.checkSomeGroup) {
                        this.checkAllGroup = false
                    }
                    if (this.checkAllFleet) {
                        this.checkSomeFleet = false
                    }
                    if (this.checkSomeFleet) {
                        this.checkAllFleet = false
                    }
                    if (this.checkAllMonitor) {
                        this.checkSomeMonitor = false
                    }
                    if (this.checkSomeMonitor) {
                        this.checkAllMonitor = false
                    }
                },
                loadChildren: function (node, resolve) {
                    var that = this;
                    if (node.data) {
                        that.getChild(node.data.id, node.data.type, resolve);
                    } else {
                        setTimeout(function () {
                            that.getChild(window.fleetId, 0, resolve);
                        }, 0);
                    }
                },
                getChild: function (id, type, resolve) {
                    var jsonData = {
                        parentId: id,
                        type: type
                    };
                    axios.post('/scs/fleetManage/getFleet', jsonData)
                        .then(function (res) {
                            res = res.data;
                            if (res.success) {
                                var childNodes = [];
                                if (res.obj) {
                                    childNodes = res.obj;
                                }
                                resolve(childNodes);
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });
                },
                filterNode: function (value, data) {
                    if (!value)
                        return true;
                    else
                        return data.name.indexOf(value) !== -1;
                },
                loadData: function (node) {
                    this.fleetName = node.name;
                    this.searchData.fleetName = node.name;
                    this.searchData.fleetId = node.id;
                },
                loadDataa: function (node) {
                    this.form.fleetName = node.name;
                    this.form.fleetId = node.id;
                    this.form.subType ='';
                    this.getSubType(node.id);
                },
                query: function (pageNum) {
                    if(pageNum){
                        this.pageNum=pageNum
                    }
                    var data = {
                        fleetId: this.searchData.fleetId || window.fleetId,
                        pageNum:  this.pageNum,
                        pageSize: this.pageSize,
                        subName:this.subName||'',
                        subNumber:this.subNumber||'',
                        extNumber:this.extNumber||'',
                    };
                    axios.post('/scs/subscriberManage/getFleetSub', data)
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                for (var i = 0; i < data.obj.list.length; i++) {
                                    data.obj.list[i].CREATEDATETIME = timeFormat(data.obj.list[i].CREATEDATETIME);
                                }
                                if (res.data.success) {
                                    this.tableData = data.obj.list;
                                    this.total = data.obj.total;
                                } else {
                                    this.$message('查询失败');
                                }
                            } else {
                                this.$message('查询失败');
                            }
                        }.bind(this)).catch(function () {

                    }.bind(this));
                },
                getExtNumber: function () {
                    axios.post('/scs/userManage/getExtNumber', {})
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                if (res.data.success) {
                                    this.extNumberOptions = data.obj.list;
                                } else {
                                    this.$message(res.msg);
                                }
                            } else {
                                this.$message(res.msg);
                            }
                        }.bind(this)).catch(function () {

                    }.bind(this));
                },
                getSubType: function (id) {
                    var that=this;
                    axios.post('/scs/subscriberManage/getSubType', {fleetId: id})
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                if (res.data.success) {
                                    that.subTypeOptions = data.obj.list;
                                } else {
                                    that.$message(res.msg);
                                }
                            } else {
                                that.$message(res.msg);
                            }
                        }.bind(this)).catch(function () {

                    }.bind(this));
                },
                getMobileType: function () {
                    axios.post('/scs/subscriberManage/getMobileType', {})
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                if (res.data.success) {
                                    this.mobileTypeOptions = data.obj.list;
                                } else {
                                    this.$message(res.msg);
                                }
                            } else {
                                this.$message(res.msg);
                            }
                        }.bind(this)).catch(function () {

                    }.bind(this));
                },
                formClear: function () {
                    this.form.subId = '';
                    this.form.fleetId = '';
                    this.form.fleetName = '';
                    this.form.subType = '';
                    this.form.mobileType = '';
                    this.form.extNumber = '';
                    this.form.name = '';
                    this.form.number = '';
                    this.form.password = '';
                },
                add: function () {
                    var that = this;
                    that.formClear();
                    that.showBox = true;
                    that.showAdd = true;
                    that.title = "添加终端";
                    that.getExtNumber();
                },
                addSubscriber: function () {
                    var that = this;
                    var data = {
                        fleetId: that.form.fleetId,
                        subType: that.form.subType,
                        mobileType: that.form.mobileType,
                        extNumber: that.form.extNumber,
                        name: that.form.name,
                        number: that.form.number,
                        password: Md5_Encrpt(that.form.password)
                    };
                    if(that.form.fleetId===''){
                        this.$message('归属集团不能为空');
                        return
                    }
                    if(that.form.subType===''){
                        this.$message('终端类型不能为空');
                        return
                    }
                    if(that.form.name==='' || that.form.number===''){
                        this.$message('终端名称或终端号码不能为空');
                        return
                    }
                    axios.post('/scs/subscriberManage/addSubscriber', data)
                        .then(function (res) {
                            var res = res.data;
                            if (res.success) {
                                that.closeBox();
                                that.$message('添加成功');
                                that.query(that.pageNum);
                            } else {
                                that.$message(res.msg);
                            }
                        })
                        .catch(function (err) {
                            console.log(err);
                        });
                },
                updateSubscriber: function () {
                    var that = this;
                    var data = {
                        subId: that.form.subId,
                        fleetId: that.form.fleetId,
                        subType: that.form.subType,
                        mobileType: that.form.mobileType,
                        extNumber: that.form.extNumber,
                        name: that.form.name,
                        number: that.form.number
                    };
                    if (that.form.password === that.oldPassword) {
                        data.password = that.form.password
                    } else {
                        data.password = Md5_Encrpt(that.form.password)
                    }
                    if(that.form.name==='' || that.form.number===''){
                        this.$message('终端名称或终端号码不能为空');
                        return
                    }
                    axios.post('/scs/subscriberManage/updateSubscriber', data)
                        .then(function (res) {
                            var res = res.data;
                            if (res.success) {
                                that.closeBox();
                                that.$message('修改成功');
                                that.query(that.pageNum);
                            } else {
                                this.$message(res.msg);
                            }
                        })
                        .catch(function (err) {
                            console.log(err);
                        });
                },
                operate: function (row, href) {
                    var that = this;
                    that.formClear();
                    if (href.indexOf('update') !== -1) {
                        that.getExtNumber();
                        that.showBox = true;
                        that.showAdd = false;
                        that.title = "编辑终端";
                        that.form.subId = row.subscriber_id;
                        that.form.fleetId = row.FLEET_ID;
                        that.getSubType(row.FLEET_ID);
                        that.form.fleetName = row.fleetName;
                        that.form.subType = row.SUBTYPE_ID;
                        that.form.mobileType = row.mobileTypeId;
                        that.form.extNumber = row.EXTNUMBER;
                        that.form.name = row.NAME;
                        that.form.number = row.NUMBER;
                        that.form.password = row.User_login_password;
                        that.oldPassword = row.User_login_password;
                    } else if (href.indexOf('delete') !== -1) {
                        this.$confirm('是否确定删除', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                        axios.post('/scs/subscriberManage/deleteSubscriber', {subId: row.subscriber_id,extNumber:row.EXTNUMBER})
                            .then(function (res) {
                                var res = res.data;
                                if (res.success) {
                                    that.$message('删除成功');
                                    that.query(that.pageNum);
                                }
                            })
                            .catch(function (err) {
                                console.log(err);
                            });});
                    } else if (href.indexOf("guarder") !== -1) {
                        this.guarderManage.subId = row.subscriber_id;
                        this.queryGuarder(row.subscriber_id);

                    }
                },
                queryGuarder: function (subId) {
                    console.info("queryGuarder");
                    var jsonData = {
                        subId:subId
                    };
                    axios.post('/scs/subscriberManage/queryGuarder', jsonData)
                        .then(function (res) {
                            res = res.data;
                            if (res.success) {
                                window.subscriberManageVue.guarderManage.chooseData = res.obj;
                                window.subscriberManageVue.guarderManage.seen = true;
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });

                },
                deleteGuarderMember: function (id) {
                    for (var i = 0; i < this.guarderManage.chooseData.length; i++) {
                        if (id === this.guarderManage.chooseData[i].id) {
                            this.guarderManage.chooseData.splice(i, 1);
                            var node = this.$refs.tree.getNode(id);
                            node.checked = false;
                        }
                    }
                },
                handleGuarderCheckChange: function (data, checked, indeterminate) {
                    console.log(data, checked, indeterminate);
                    if (data.type === 2 && checked) {
                        var nodeObj = {};
                        nodeObj.id = data.id;
                        if (data.name.length > 5) {
                            nodeObj.name = data.name.substring(0, 5) + '...';
                        } else {
                            nodeObj.name = data.name;
                        }
                        var length = false;
                        for (var i = 0; i < this.guarderManage.chooseData.length; i++) {
                            var id = this.guarderManage.chooseData[i].id;
                            if (data.id === this.guarderManage.chooseData[i].id) {
                                length = true;
                            }
                        }
                        if (!length) {
                            this.guarderManage.chooseData.push(nodeObj);
                        }
                    } else if (data.type === 2 && !checked) {
                        for (var i = 0; i < this.guarderManage.chooseData.length; i++) {
                            if (data.id === this.guarderManage.chooseData[i].id) {
                                this.guarderManage.chooseData.splice(i, 1);
                            }
                        }
                    }
                    for (var i = 0; i < this.guarderManage.chooseData.length; i++) {
                        var node = this.$refs.tree.getNode(this.guarderManage.chooseData[i].id);
                        if (node.checked === false) {
                            node.checked = true;
                        }
                    }
                },
                loadGuarderChildren: function (node, resolve) {
                    var that = this;
                    if (node.data) {
                        if(node.data.type === 2){
                            var childNodes = [];
                            return resolve(childNodes);
                        }else {
                            that.getGuarderChild(node.data.id, node.data.type, resolve);
                        }
                    } else {
                        setTimeout(function () {
                            that.getGuarderChild(window.fleetId, 0, resolve);
                        }, 0);
                    }
                },
                getGuarderChild: function (id, type, resolve) {
                    console.info("getGuarderChild");
                    var jsonData = {
                        parentId: id,
                        type: type
                    };
                    axios.post('/scs/fleetManage/getFleetAndSub', jsonData)
                        .then(function (res) {
                            res = res.data;
                            if (res.success) {

                                var childNodes = [];
                                if (res.obj && res.obj.length>0) {
                                    for(var i=0;i<res.obj.length;i++){
                                        if(res.obj[i].type===2){
                                            res.obj[i].isLeaf=true;
                                        }
                                    }
                                    childNodes = res.obj;
                                }else {
                                    var node = window.subscriberManageVue.$refs.tree.getNode(id);
                                    node.loading = false;
                                    return
                                }
                                resolve(childNodes);
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });
                    for (var i = 0; i < this.guarderManage.chooseData.length; i++) {
                        var node = this.$refs.tree.getNode(this.guarderManage.chooseData[i].id);
                        if (node.checked === false) {
                            node.checked = true;
                        }
                    }
                },
                guarderModify(){

                    for(var i = 0; i < this.guarderManage.chooseData.length; i++) {
                        console.info("guarderManage "+this.guarderManage.chooseData[i].name)
                    }
                    var jsonData = {
                        relativeIds: this.guarderManage.chooseData,
                        subId: this.guarderManage.subId
                    };
                    axios.post('/scs/subscriberManage/modifyGuarder', jsonData)
                        .then(function (res) {
                            res = res.data;
                            if (res.success) {
                                window.subscriberManageVue.guarderManage.seen = false;
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });

                },
                filterGuarderNode: function (value, data) {
                    if (!value)
                        return true;
                    else
                        return data.name.indexOf(value) !== -1;
                },


                changePageNum: function (val) {
                    this.pageNum = val;
                    this.query(this.pageNum);
                },
                closeBox: function () {
                    this.formClear();
                    this.showBox = false;
                    this.showImportBox = false;
                },
                handleSelectionChange: function (val) {
                    this.multipleSelection = val;
                },
                batchExport:function () {
                    var that=this;
                    var data = {
                        multipleSelection:this.multipleSelection||'',
                    };
                    if(data.multipleSelection.length<1){
                        that.$message("请选择需要导出的终端");
                        return;
                    }
                    axios.post('/scs/subscriberManage/batchExport', data)
                        .then(function (res) {
                            if (res.status === 200) {
                                var data = res.data;
                                if (res.data.success) {
                                    var url="http://"+nginxIp+":1604/upload/"+res.data.obj.url+".xls";
                                    var downloadDom = document.getElementById('downloadFrame');
                                    downloadDom.setAttribute('src', url);
                                    that.multipleSelection=[];
                                    that.query(that.pageNum);
                                } else {
                                    that.$message('');
                                }
                            } else {
                                that.$message('');
                            }
                        }.bind(this)).catch(function () {

                    }.bind(this));
                },
                    this.formClear();
                    this.showBox = false;
                },
            }
        });
    }
</script>
</html>
